<template>
  <div class="lcds-root-container">
    <div class="lc-form" style="--formItemSpace: 150px">
      <el-form
        ref="formRef"
        :model="formModel"
        :rules="rules"
        :disabled="status === 'preview'"
        label-width="100px"
      >
        <el-form-item class="lc-form-item" label="xxxx" prop="add">
          <div class="lc-form-item__box">
            <lc-tree v-model="formModel.add" :config="addTreeConfig" :tree-data="addTreeData">
            </lc-tree>
          </div>
        </el-form-item>
        <lc-rower> </lc-rower>
      </el-form>
    </div>
  </div>
</template>

<script setup>
import { onBeforeMount, ref, unref } from 'vue';

import { request } from '@/apis/request';
defineOptions({
  name: 'EditTable'
});

const emit = defineEmits(['submit']);

const props = defineProps({ status: { type: String, default: '' } });

const formModel = ref({ add: [] });
const addTreeConfig = ref({
  defaultProps: { children: 'children', label: 'label' },
  showCheckbox: false,
  expandAll: true,
  nodeKey: 'id'
});
const addTreeData = ref([]);
const formRef = ref(null);
const loading = ref(false);
const rules = ref({});
const searches = new URLSearchParams(document.location.search.substring(1));
const formStatus = props.status || searches.get('status') || 'add';

function addTreeQueryData() {
  const params = {
    url: '/v1/gateway/1648160260487245826/1767862025555623938',
    method: 'DELETE',
    headers: { token: '${x-user-token}' },
    responseType: 'json'
  };
  try {
    request(params).then((res) => {
      if (res.success) {
        addTreeData.value = res.data || [];
      }
    });
  } catch (e) {
    console.log(e);
  }
}
const queryFormData = (queryData = {}) => {
  let params = { url: '', method: '' };
  loading.value = true;
  return request({
    ...params,
    params: {
      ...queryData
    }
  })
    .then((res = {}) => {
      const data = res.data || {};
      Object.keys(data).forEach((key) => {
        formModel.value[key] = [null, undefined].includes(data[key])
          ? formModel.value[key]
          : data[key];
      });
    })
    .finally(() => {
      loading.value = false;
    });
};

onBeforeMount(() => {
  addTreeQueryData();
});
</script>
